<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>fetch补充</h1>
    <hr>
    <button id="btn01">点我一下</button>
    <button id="btn02">取消</button>

    <script>
        const btn01 = document.getElementById("btn01")
        const btn02 = document.getElementById("btn02")


        let controller
        btn01.onclick = () =>{
            // 创建一个AbortController
            controller = new AbortController()
            // 终止请求

            fetch("http://localhost:3000/text",{
                signal:controller.signal
            })
            .then((res) => console.log(res))
            .catch((err) => console.log("出错了",err))
        }

        btn02.onclick = () =>{
            controller && controller.abort()
        }
    </script>
</body>
</html>